<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>ishowshao paste</title>
    <style>
        #create textarea {
            padding: 0;
            margin: 0;
            width: 500px;
            height: 100px;
        }
    </style>
    <script src="../scripts/jquery-1.7.1.js"></script>
    <script>
        jQuery(function () {
            $.get('read.php', function (data) {
                $('#read').html(data);
            });
            $('#create textarea').blur(function () {
                if ($(this).val() == '') {
                    return;
                }
                $.ajax({
                    url: 'create.php',
                    data: {
                        content: $(this).val()
                    },
                    type: 'post',
                    dataType: 'json',
                    success: function (result) {
                        if (result.success) {
                            $('#read').html($('#read').html() + result.data + '<br />');
                            $('#create textarea').val('');
                        }
                    }
                });
            });
            $('button').click(function () {
                $.ajax({
                    url: 'delete.php',
                    success: function () {
                        $('#read').html('');
                    }
                });
            });
        });
    </script>
</head>
<body>
    <div id="read">

    </div>
    <div id="create">
        <label>
            <textarea></textarea>
        </label>
        <button>清空</button>
    </div>
</body>
</html>
